<template>
    <div class='root'>
        <!--点击按钮时，发射一个事件，告诉菜单我要打开了-->
        <span class='fa fa-arrow-left back-btn' 
        @click='goback'>
        </span>
        <span class='title'><slot></slot></span>
        <span class='fa fa-user-o user-btn'></span>
    </div>
</template>

<script>
    export default{
        methods:{
            goback:function(){
                history.back()
            },
        }
    }
</script>

<style scoped>
    .root{
        height: 50px;
        background-color: #282828;
        display: flex;
        justify-content: space-between;
    }
    .root span{
        line-height: 50px;
        font-size: 1.6rem;        
    }
    .back-btn{
        color:#999999;
        padding-left: 1rem;
    }
    .title{
        color:#ffffff;
    }
    .user-btn{
        color:#999999;
        padding-right: 1rem;
    }
</style>